<!DOCTYPE html>
<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js" lang="en">
	<!--<![endif]-->
	<head>
		<meta name="layout" content="aqvLayout2">
		<meta http-equiv="Content-type" content="text/html; charset=utf-8">
		<meta charset="utf-8"/>
		<title>A quien voto | Politicos</title>
	</head>
	<body>
		<!-- HIDDEN PANEL 
		================================================== --><%--
		<div id="panel">
			<div class="row">
				<div class="twelve columns">
					<img src="images/info.png" class="pics" alt="info">
					<div class="infotext">
						 Thank you for visiting my theme! Replace this with your message to visitors.
					</div>
				</div>
			</div>
		</div>
		<p class="slide">
			<a href="#" class="btn-slide"></a>
		</p>--%>
		<!-- HEADER
		================================================== -->
		<%--<div class="row">	
				<div class="four columns">
					<div class="logo">
						<a href="index.html"><h4>Studio Francesca</h4></a>
					</div>
				</div>
				<div class="eight columns noleftmarg">		
					<nav id="nav-wrap">
						<ul class="nav-bar sf-menu">
						
							<li class="current">
							<a href="index.html">Home</a>
								<ul>
														
								<li><a href="index2.html">Without slider</a></li>						
								</ul>
							</li>
							
							<li>
							<a href="#">Portofolio</a>
								<ul>
								<li><a href="portofolio2.html">2 Columns</a></li>
								<li><a href="portofolio3.html">3 Columns</a></li>
								<li><a href="portofolio4.html">4 Columns</a></li>						
								<li><a href="portofoliodetail.html">Project Details</a></li>
								</ul>
							</li>
							
							<li>
							<a href="#">Blog</a>
								<ul>
								<li><a href="blogpage1.html">Blog page style 1</a></li>
								<li><a href="blogpage2.html">Blog page style 2</a></li>
								<li><a href="blogpage3.html">Blog page style 3</a></li>
								<li><a href="blogsinglepost.html">Single post</a></li>
								</ul>
							</li>
							
							<li>
							<a href="#">Pages</a>
								<ul>
								<li><a href="about.html">About us</a></li>
								<li><a href="services.html">Services</a></li>						
								</ul>
							</li>
							
							<li>
							<a href="#">Features</a>
								<ul>
								<li><a href="columns.html">Columns</a></li>
								<li><a href="elements.html">Elements</a></li>
								<li><a href="typography.html">Typography</a></li>
								</ul>
							</li>
							
							<li>
							<a href="contact.html">Contact</a>
							</li>
							
						</ul>
						</nav>
				</div>	
		</div>
		<div class="clear">
		</div>
		--%><!-- SUBHEADER
		================================================== -->
		<div id="subheader">
			<div class="row">
				<div class="twelve columns">
					<p class="left">
						 Listado de politicos
					</p>
<%--					<g:if test="${session?.user}">--%>
					<sec:ifLoggedIn>
						<p class="right">El politico que buscas no esta?, <a href="${createLink(controller : 'Politician', action:'create')}">agregalo !!</a></p>
<%--					</g:if>--%>
					</sec:ifLoggedIn>
				</div>
			</div>
		</div>
		<div class="hr">
		</div>
		<!-- CONTENT 
		================================================== -->
		<div class="row">
			<div class="twelve columns">
			
				
				<g:hasErrors bean="${politicianInstance}">
					<g:eachError bean="${politicianInstance}" var="error">
						<div class="alert-box alert"><g:message error="${error}"/></div>
					</g:eachError>
				</g:hasErrors>
			
				<!-- CATEGORIES-->
				<section id="options" class="clearfix">
				<ul id="filters" class="option-set clearfix" data-option-key="filter">
					<li><a href="#filter" data-option-value="*" class="portofoliobutton selected">Show all</a></li>
					<li><a href="#filter" data-option-value=".nature" class="portofoliobutton">Nature</a></li>
					<li><a href="#filter" data-option-value=".trains" class="portofoliobutton">Trains</a></li>
					<li><a href="#filter" data-option-value=".castles" class="portofoliobutton">Castles</a></li>
				</ul>
				</section>
			</div>
		</div>
		<div class="row">
			<div id="portofolio">
				<!-- Project 1-->
				<g:each in="${politicianInstanceList}" status="i" var="politicianInstance">
					<div class="three columns category trains">
						<h5>
							<a href="${createLink(controller : 'Politician', action:'show', params: [id:politicianInstance.id])}">
								${fieldValue(bean: politicianInstance, field: "name")}
							</a>
						</h5>
						<p>
							${fieldValue(bean: politicianInstance, field: "description")}
						</p>
						<div class="portofoliothumb">
							<div class="portofoliothumboverlay fouroverlay">
								<div class="viewgallery fourgallery">
									<a data-gal="prettyPhoto[gallery]" href="images/temp/folio1.jpg"><img src="images/playgal.png" class="left galleryicon" alt=""> Gallery</a>
								</div>
								<div class="inner fourdetail">
									<a class="projectdetail" href="${createLink(controller : 'Politician', action:'show', params: [id:politicianInstance.id])}">
										+ Detalles personales
									</a>
								</div>
							</div>
							<img class="fourimage" src="data:image/png;base64,${politicianInstance.profilePic.encodeBase64()}" />
<%--							<img class="fourimage" src=${resource(dir: '/images/politicians/'+politicianInstance.surName +'_' +politicianInstance.name+'/', file: politicianInstance.profilePic)} />--%>
	<%--						<img src="images/temp/folio1.jpg" class="fourimage" alt=""/>--%>
						</div>
					</div>
				</g:each>
				<!-- Project 2-->
				<%--<div class="three columns category castles">
					<h5>BLUE NIGHT</h5>
					<p>
						 Lorem ipsum dolor sit amet, consectetur adipisicing elit.
					</p>
					<div class="portofoliothumb">
						<div class="portofoliothumboverlay fouroverlay">
							<div class="viewgallery fourgallery">
								<a data-gal="prettyPhoto[gallery]" href="images/temp/folio2.jpg"><img src="images/playgal.png" class="left galleryicon" alt=""> Gallery</a>
							</div>
							<div class="inner fourdetail">
								<a class="projectdetail" href="portofoliodetail.html">+ Project Details</a>
							</div>
						</div>
						<img src="images/temp/folio2.jpg" class="fourimage" alt=""/>
					</div>
				</div>
				--%><!-- Project 3-->
				<%--<div class="three columns category nature">
					<h5>NOSTALGIA</h5>
					<p>
						 Lorem ipsum dolor sit amet, consectetur adipisicing elit.
					</p>
					<div class="portofoliothumb">
						<div class="portofoliothumboverlay fouroverlay">
							<div class="viewgallery fourgallery">
								<a data-gal="prettyPhoto[gallery]" href="images/temp/folio3.jpg"><img src="images/playgal.png" class="left galleryicon" alt=""> Gallery</a>
							</div>
							<div class="inner fourdetail">
								<a class="projectdetail" href="portofoliodetail.html">+ Project Details</a>
							</div>
						</div>
						<img src="images/temp/folio3.jpg" class="fourimage" alt=""/>
					</div>
				</div>
				--%><!-- Project 4-->
	<%--			<div class="three columns category castles">--%>
	<%--				<h5>COLD CASTLE</h5>--%>
	<%--				<p>--%>
	<%--					 Lorem ipsum dolor sit amet, consectetur adipisicing elit.--%>
	<%--				</p>--%>
	<%--				<div class="portofoliothumb">--%>
	<%--					<div class="portofoliothumboverlay fouroverlay">--%>
	<%--						<div class="viewgallery fourgallery">--%>
	<%--							<a data-gal="prettyPhoto[gallery]" href="images/temp/folio4.jpg"><img src="images/playgal.png" class="left galleryicon" alt=""> Gallery</a>--%>
	<%--						</div>--%>
	<%--						<div class="inner fourdetail">--%>
	<%--							<a class="projectdetail" href="portofoliodetail.html">+ Project Details</a>--%>
	<%--						</div>--%>
	<%--					</div>--%>
	<%--					<img src="images/temp/folio4.jpg" class="fourimage" alt=""/>--%>
	<%--				</div>--%>
	<%--			</div>--%>
				<!-- Project 5--><%--
				<div class="three columns category nature castles">
					<h5>RED FLOWERS</h5>
					<p>
						 Lorem ipsum dolor sit amet, consectetur adipisicing elit.
					</p>
					<div class="portofoliothumb">
						<div class="portofoliothumboverlay fouroverlay">
							<div class="viewgallery fourgallery">
								<a data-gal="prettyPhoto[gallery]" href="images/temp/folio5.jpg"><img src="images/playgal.png" class="left galleryicon" alt=""> Gallery</a>
							</div>
							<div class="inner fourdetail">
								<a class="projectdetail" href="portofoliodetail.html">+ Project Details</a>
							</div>
						</div>
						<img src="images/temp/folio5.jpg" class="fourimage" alt=""/>
					</div>
				</div>
				--%><!-- Project 6-->
				<%--<div class="three columns category nature">
					<h5>SHADOW LIGHT</h5>
					<p>
						 Lorem ipsum dolor sit amet, consectetur adipisicing elit.
					</p>
					<div class="portofoliothumb">
						<div class="portofoliothumboverlay fouroverlay">
							<div class="viewgallery fourgallery">
								<a data-gal="prettyPhoto[gallery]" href="images/temp/folio6.jpg"><img src="images/playgal.png" class="left galleryicon" alt=""> Gallery</a>
							</div>
							<div class="inner fourdetail">
								<a class="projectdetail" href="portofoliodetail.html">+ Project Details</a>
							</div>
						</div>
						<img src="images/temp/folio6.jpg" class="fourimage" alt=""/>
					</div>
				</div>
				--%><!-- Project 7-->
				<%--<div class="three columns category nature">
					<h5>BIG CITY</h5>
					<p>
						 Lorem ipsum dolor sit amet, consectetur adipisicing elit.
					</p>
					<div class="portofoliothumb">
						<div class="portofoliothumboverlay fouroverlay">
							<div class="viewgallery fourgallery">
								<a data-gal="prettyPhoto[gallery]" href="images/temp/folio7.jpg"><img src="images/playgal.png" class="left galleryicon" alt=""> Gallery</a>
							</div>
							<div class="inner fourdetail">
								<a class="projectdetail" href="portofoliodetail.html">+ Project Details</a>
							</div>
						</div>
						<img src="images/temp/folio7.jpg" class="fourimage" alt=""/>
					</div>
				</div>
				--%><!-- Project 8-->
				<%--<div class="three columns category nature">
					<h5>DEEP FOREST</h5>
					<p>
						 Lorem ipsum dolor sit amet, consectetur adipisicing elit.
					</p>
					<div class="portofoliothumb">
						<div class="portofoliothumboverlay fouroverlay">
							<div class="viewgallery fourgallery">
								<a data-gal="prettyPhoto[gallery]" href="images/temp/folio8.jpg"><img src="images/playgal.png" class="left galleryicon" alt=""> Gallery</a>
							</div>
							<div class="inner fourdetail">
								<a class="projectdetail" href="portofoliodetail.html">+ Project Details</a>
							</div>
						</div>
						<img src="images/temp/folio8.jpg" class="fourimage" alt=""/>
					</div>
				</div>
			--%></div>
		</div>
		<div class="hr">
		</div>

	</body>
</html>